const aData = JSON.parse(localStorage.getItem("薪资总data"));
const allData = aData.allData;


function renderBody1(allData, currentPage = 1) {
    singlePageNum = 2;
    const statIndex = singlePageNum * (currentPage - 1);
    const endIndex = statIndex + singlePageNum;
    allData1 = allData.slice(statIndex, endIndex);
    $("#information-top").empty();
    renderPaging1(allData, currentPage);
    for (let i = 0; i < allData1.length; ++i) {
        $("#information-top").append(
            `
                <div class="table">
                <div class="basicInformation">
                <div class="tableName ">
                    <h4>${allData1[i].name}</h4> 
                    <span class="tittle " id="span${i}">${allData1[i].state}</span>
                </div>
                <div class="group">
                    <span>薪资组：</span>
                    <span>${allData1[i].departmentList}</span>
                </div>
                <div class="time">
                    <span>算薪周期：</span>
                    <span>${allData1[i].month}</span>
                </div>
            </div>
            <div class="accountingInformation">
                <div class="num">
                    <h4>薪资核算</h4>
                    <p>
                        <span>核算总人数：${allData1[i].length}</span>
                        <span>预扣总个税：${allData1[i].allIndividualIncomeTax}</span>
                        <span>实发总金额：${allData1[i].totalMoney}</span>
                    </p>
                </div>
                <div class="button">
                    <button type="button" class="btn btn-info">查看详情</button>
                    <button type="button" class="btn btn-info stop" id="${allData1[i].name}">终止核算</button>
                </div>
            </div>
            </div>
                `
        );

        if (allData1[i].state === "进行中") {
            $(".tittle").addClass("orange");
        }
        if (allData1[0].state === "已完成") {
            $(`#span${0}`).removeClass("orange");
            $(`#span${0}`).addClass("green");
        }
        if (allData1[i].state === "已完成") {
            $(`#span${i}`).removeClass("orange");
            $(`#span${i}`).addClass("green");
        }
    }
}

function renderPaging1(allData, currentPage = 1) {
    $("#pages").empty();
    const num = Math.ceil(allData.length / singlePageNum);
    for (let i = 1; i <= num; ++i) {
        $("#pages").append(`<span>${i}</span>`);
    }
    $("#pages > span").eq(currentPage - 1).addClass("currentPage");
}

// 页码
$("#pages").on("click", "span", function (event) {
    const currentPage = parseInt($(event.target).text());
    renderBody1(allData, currentPage);
});
// 上一页
$("#pre").on("click", function () {
    const currentPage = parseInt($("#pages > .currentPage").text());
    if (currentPage === 1) {
        return;
    }
    else {
        renderBody1(allData, currentPage - 1);
    }
});
// 下一页
$("#next").on("click", function () {
    const currentPage = parseInt($("#pages > .currentPage").text());
    if (currentPage === $("#pages span").length) {
        return;
    }
    else {
        renderBody1(allData, currentPage + 1);
    }
});
renderBody1(allData);

$("#newadd").on("click", function () {
    window.location.href = "../薪资/新增薪资核算.html";
});

// 点击终止
$("#information-top").on("click", ".stop", function (event) {
    dataId1 = $(event.target).attr("id");
    for (let i = 0; i < allData.length; ++i) {
        if (dataId1 === allData[i].name) {
            allData[i].state = "已完成";
        }
    }
    renderBody1(allData);
});

$("#reset").on("click", function () {
    $("#screen").empty();
    let matter =$(".condition input").val()
    $("#screen").append(`
    <span class="screen">筛选条件：</span>
    <span class="trem ">${matter}</span>
    `);
    let newData1 =[]
    for(let i = 0; i <allData.length;++i){
        for(let key in allData[i]){
            if(matter === allData[i][key]){
                newData1.push(allData[i])
            }
        }
    }
    renderBody1(newData1)

});
